<template>
    <view class="warpper">
        <!-- pages/setParkingimg/index.wxml -->
					 <!-- 返回 -->
					 <view class="icon" v-if="weixin == 2" @tap="goMy" :style="'top:48rpx'">
					      <van-icon name="arrow-left" color="#333" size="45rpx" />
					  </view>
        <view class="img" v-if="img" @touchmove="touchmoveCallback" @touchstart="touchstartCallback" @tap="closeCard">
            <!-- 头部信息 -->
            <view
                class="headTitle"
                :style="
                    'padding: ' +
                    20 * touch.scale +
                    'px;padding-top: ' +
                    10 * touch.scale +
                    'px; font-size:' +
                    topTitle.fontSize * touch.scale +
                    'px;height:' +
                    topTitle.height * touch.scale +
                    'px;width:' +
                    632 +
                    'rpx;left:' +
                    topTitle.left * touch.scale +
                    'px;top:0rpx' 
                "
            >
                <view class="headTitleDiv1" :style="'font-size:' + topTitle.fontSize * touch.scale + 'px;'">
                    <view class="headTitle1" :style="'line-height:' + 30 * touch.scale + 'px;'">
                        空闲车位：
                        <text style="color: #5cca5f"></text>
                        {{ cameraInfo.totalNum + cameraInfo.tempNum - cameraInfo.useNum - cameraInfo.tempUseNum }}
                    </view>
                    <!-- {{cameraInfo.totalNum+cameraInfo.tempNum-cameraInfo.useNum-cameraInfo.tempUseNum}} -->
                    <view class="headTitle1" :style="'line-height:' + 30 * touch.scale + 'px;'">
                        总车位数：
                        <text>{{ cameraInfo.totalNum + cameraInfo.tempNum }}</text>
                    </view>
                    <!-- {{cameraInfo.totalNum+cameraInfo.tempNum}} -->
                </view>
                <view class="headTitleDiv2" :style="'font-size:' + 14 * touch.scale + 'px;color: #6A6A6A;'">
                    <view class="headTitle2 green">
                        <view
                            :style="
                                'top:' +
                                5 * touch.scale +
                                'px;left:' +
                                44 * touch.scale +
                                'px; position: absolute; width:' +
                                10 * touch.scale +
                                'px;height:' +
                                10 * touch.scale +
                                'px;border-radius: 50%;background: green;display: inline-block;'
                            "
                        ></view>
                        <view :style="'text-indent: ' + 25 * touch.scale + 'px;display: inline-block;'">有空闲车位</view>
                    </view>

                    <view class="headTitle2 red">
                        <view
                            :style="
                                'top:' +
                                5 * touch.scale +
                                'px;left:' +
                                44 * touch.scale +
                                'px;position: absolute; width:' +
                                10 * touch.scale +
                                'px;height:' +
                                10 * touch.scale +
                                'px;border-radius: 50%;background: red;display: inline-block;'
                            "
                        ></view>
                        <view :style="'text-indent: ' + 25 * touch.scale + 'px;display: inline-block;'">车位已满</view>
                    </view>
                </view>
            </view>

            <!-- 卡片弹框 -->
            <view
                class="card"
                @tap.stop.prevent="clickPackInfo"
                v-if="showCard"
                :style="'position: absolute; font-size:' + card.fontSize * touch.scale + 'px;left:' + card.left * touch.scale + 'px;top:' + card.top * touch.scale + 'px;'"
            >
                <view class="close" @tap.stop.prevent="closeCard" style="right: 0; position: absolute; z-index: 999">x</view>
                <view class="cardImg">
                    <image :src="cardInfo.picture2" :style="'width: ' + card.cardImg.width * touch.scale + 'px;height: ' + card.cardImg.height * touch.scale + 'px;top:0rpx;margin:0 auto'"></image>
            <!--        <text class="cardWord" style="position: absolute; width: 100%; text-align: center; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); color: #fff">
                        {{ cardInfo.cameraName }}
                    </text> -->
                </view>
            </view>

            <image :src="img" :style="'width: ' + touch.scaleWidth + 'px;height: ' + touch.scaleHeight + 'px'" arrr='111' mode="widthFix" @load="bindload">
                <!-- <view style="position: absolute;color: #000;top: 0px;">{{info}}</view> -->
                <view
                    :data-left="item.left"
                    :data-top="item.top"
                    :data-id="item.id"
                    :class="item.class"
                    @tap.stop.prevent="clickPark"
                    :style="
                        'background:' +
                        item.background +
                        ';left:' +
                        item.left * touch.scale +
                        'px;top:' +
                        item.top * touch.scale +
                        'px;height:' +
                        item.height * touch.scale +
                        'px;width:' +
                        item.width * touch.scale +
                        'px;transform:rotate(' +
                        item.rotate +
                        ');'
                    "
                    v-for="(item, key) in parkList"
                    :key="item.key"
                ></view>
            </image>
        </view>
        <view v-else>
            <view class="nopark">
                <image src="../../static/assets/img/empty.png"></image>
            </view>
            <view class="text">暂无停车示位图</view>
        </view>
    </view>
</template>

<script>
// pages/setParkingimg/index.js
import util from './../../utils/util.js';
import api from './../../utils/api.js';
export default {
    data() {
        return {
            cardInfo: {
                picture2: '',
                cameraName: ''
            },

            parkingCode: '',

            cameraInfo: {
                totalNum: '',
                tempNum: ''
            },
			weixin:uni.getStorageSync('weixin'),
            showCard: false,

            topTitle: {
                width: 318,
                height: 43,
                top: 10,
                fontSize: 18,
                left: 8
            },

            card: {
                width: 280,
                height: 100,
                top: 150,
                fontSize: 12,
                left: 80,
                cardImg: {
                    width: 325,
                    height: 190
                }
            },

            img: '',
            info: '',
            distance: 0,

            parkList: [
                // {//正大门
                //   id:"cc919d42a89479eb",
                //   idName:"正大门",
                //   background: "",
                //   class: "parkClass",
                //   left: "70",
                //   top: "108",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //11表示第一行第一列
                    id: '6833f83e00e3166b',
                    idName: '8幢通道外侧',
                    background: '',
                    class: 'parkClass',
                    left: '114',
                    top: '162',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //12
                    id: 'c079dcbb5e93617',
                    idName: '8幢通道中间',
                    background: '',
                    class: 'parkClass',
                    left: '158',
                    top: '162',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //13
                    id: '19ec34faed81e20c',
                    idName: '8幢通道朝里',
                    background: '',
                    class: 'parkClass',
                    left: '201',
                    top: '162',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //14
                    id: '7f5f0d17c7f13998',
                    idName: '8幢通道里',
                    background: '',
                    class: 'parkClass',
                    left: '245',
                    top: '162',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //21
                    id: 'dbee88c978dd4722',
                    background: '',
                    idName: '7幢外小河边',
                    class: 'parkClass',
                    left: '71',
                    top: '176',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
                {
                    //31
                    id: '1b04d22844de7dbf',
                    idName: '',
                    background: '',
                    class: 'parkClass',
                    left: '71',
                    top: '202',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
                {
                    //41
                    id: '26ec9a84a16238e2',
                    background: '',
                    class: 'parkClass',
                    left: '90',
                    top: '227',
                    width: '56',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //42
                    id: 'c7ccbb544a54fa5a',
                    background: '',
                    class: 'parkClass',
                    left: '148',
                    top: '227',
                    width: '56',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //43
                    id: 'a848fbacf2bc2290',
                    background: '',
                    class: 'parkClass',
                    left: '205',
                    top: '227',
                    width: '56',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //51
                    id: '150f1ab165255bc9',
                    background: '',
                    class: 'parkClass',
                    left: '71',
                    top: '268',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
				{
				    //51
				    id: '2b72dd8360b366c7',
				    background: '',
				    class: 'parkClass',
				    left: '71',
				    top: '242',
				    width: '11',
				    height: '25',
				    rotate: '0deg'
				},
				{
				    //垃圾房
				    id: 'a78613ae8f96155c',
				    background: '',
				    class: 'parkClass',
				    left: '54',
				    top: '210',
				    width: '11',
				    height: '49',
				    rotate: '0deg'
				},
				{
				    //7幢通道内
				    id: 'bf1add51ea494197',
				    background: '',
				    class: 'parkClass',
				    left: '277',
				    top: '228',
				    width: '40',
				    height: '11',
				    rotate: '0deg'
				},
                {
                    //62
                    id: 'ffa68c927b4b6746',
                    background: '',
                    class: 'parkClass',
                    left: '199',
                    top: '294',
                    width: '57',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //71
                    id: '6495adf872076a7c',
                    background: '',
                    class: 'parkClass',
                    left: '77',
                    top: '315',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
                // {
                //     //81
                //     id: 'a08834e89db437b1',
                //     background: '',
                //     class: 'parkClass',
                //     left: '77',
                //     top: '341',
                //     width: '11',
                //     height: '25',
                //     rotate: '0deg'
                // },
				{
				    //81
				    id: '365db51358d22d7d',
				    background: '',
				    class: 'parkClass',
				    left: '77',
				    top: '366',
				    width: '11',
				    height: '36',
				    rotate: '0deg'
				},
                {
                    //91
                    id: 'f9e6b1d077469042',
                    background: '',
                    class: 'parkClass',
                    left: '45',
                    top: '344',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
                {
                    //10 1
                    id: '20a50aa0a49743a9',
                    background: '',
                    class: 'parkClass',
                    left: '45',
                    top: '370',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
				{
				    //11 1
				    id: '346dee0d6b8d672b',
				    background: '',
				    class: 'parkClass',
				    left: '96',
				    top: '420',
				    width: '11',
				    height: '46',
				    rotate: '0deg'
				},
				{
				    //11 1
				    id: 'fafe60ff058ef428',
				    background: '',
				    class: 'parkClass',
				    left: '114',
				    top: '354',
				    width: '46',
				    height: '11',
				    rotate: '0deg'
				},
                {
                    //12 1
                    id: 'b76f933aba411f03',
                    background: '',
                    class: 'parkClass',
                    left: '120',
                    top: '456',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //12 2
                    id: 'f73a3b659403f61',
                    background: '',
                    class: 'parkClass',
                    left: '163',
                    top: '456',
                    width: '41',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //12 3
                    id: 'b1003ebeb3266766',
                    background: '',
                    class: 'parkClass',
                    left: '205',
                    top: '456',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //12 4
                    id: 'be422eaad7c9bb08',
                    background: '',
                    class: 'parkClass',
                    left: '248',
                    top: '456',
                    width: '42',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //14 1
                    id: 'f657b301ecf932a7',
                    background: '',
                    class: 'parkClass',
                    left: '55',
                    top: '482',
                    width: '11',
                    height: '25',
                    rotate: '0deg'
                },
				{
				    //14 1
				    id: 'e11b6e2433ca5a85',
				    background: '',
				    class: 'parkClass',
				    left: '50',
				    top: '434',
				    width: '11',
				    height: '25',
				    rotate: '0deg'
				},
                {
                    //15 1
                    id: '4a4d58bd85f2a205',
                    background: '',
                    class: 'parkClass',
                    left: '81',
                    top: '573',
                    width: '11',
                    height: '18',
                    rotate: '0deg'
                },
                {
                    //16 1
                    id: '4a4d58bd85f2a205',
                    background: '',
                    class: 'parkClass',
                    left: '81',
                    top: '590',
                    width: '11',
                    height: '18',
                    rotate: '0deg'
                },
                {
                    //18 1
                    id: '55529ee1f2338b29',
                    background: '',
                    class: 'parkClass',
                    left: '144',
                    top: '658',
                    width: '11',
                    height: '20',
                    rotate: '0deg'
                }, {
                    //18 1
                    id: 'cc4dfb6e7ce559dd',
                    background: '',
                    class: 'parkClass',
                    left: '238',
                    top: '635',
                    width: '30',
                    height: '11',
                    rotate: '0deg'
                }, {
                    //18 1
                    id: 'f2dcde6cab6d371',
                    background: '',
                    class: 'parkClass',
                    left: '200',
                    top: '635',
                    width: '30',
                    height: '11',
                    rotate: '0deg'
                }
            ],

            touch: {
                distance: 0,
                scale: 1,
                baseWidth: null,
                baseHeight: null,
                scaleWidth: null,
                scaleHeight: null,
                diff: ''
            },

            parkingName: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        this.setData({
            parkingCode: options.parkingCode
        });
        this.setData({
            parkingName: decodeURIComponent(options.name)
        });
        this.findCameraGuide(this.parkingCode);
        const value = options.guidePicture; //   options.img   shareParking/headImage/2021/202111/20211119/aad63d6a-ac89-46c7-8eed-73ea1ae47172.jpg

        if (decodeURIComponent(options.name) == '下宁巷南停车场') {
            var parkList = [
                {
                    //1
                    id: '21651a819ad7943a',
                    idName: '下宁巷3-1号5幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '163',
                    top: '307',
                    width: '32',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //2
                    id: '256354656cda6b21',
                    idName: '下宁巷3-2号1幢1单元车棚',
                    background: '',
                    class: 'parkClass',
                    left: '196',
                    top: '463',
                    width: '13',
                    height: '34',
                    rotate: '0deg'
                },
                {
                    //3
                    id: '25be18139c2cc319',
                    idName: '求智巷5号3幢2单元右侧1',
                    background: '',
                    class: 'parkClass',
                    left: '366',
                    top: '233',
                    width: '13',
                    height: '34',
                    rotate: '0deg'
                },
                {
                    //4
                    id: '9ebc00ce64a9381f',
                    idName: '下宁巷3-3幢教宿电线杆2',
                    background: '',
                    class: 'parkClass',
                    left: '66',
                    top: '655',
                    width: '29',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //5
                    id: 'f1608125dfa54d39',
                    idName: '下宁巷3-1号4幢5单元附近',
                    background: '',
                    class: 'parkClass',
                    left: '77',
                    top: '363',
                    width: '34',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //6
                    id: '48e4bca9a3447e57',
                    idName: '下宁巷3-2号1幢1单元车棚旁3',
                    background: '',
                    class: 'parkClass',
                    left: '180',
                    top: '390',
                    width: '13',
                    height: '27',
                    rotate: '0deg'
                }, // {//7
                //   id:"4420801dddf64d22",
                //   idName:"下宁巷1号4幢1单元对面",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //8
                    id: '49b50938d3c22cb9',
                    idName: '下宁巷3-2号1幢4单元右边',
                    background: '',
                    class: 'parkClass',
                    left: '49',
                    top: '433',
                    width: '32',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //9
                    id: '487380810dcacce8',
                    idName: '下宁巷3-1号6幢4单元附近',
                    background: '',
                    class: 'parkClass',
                    left: '80',
                    top: '230',
                    width: '38',
                    height: '13',
                    rotate: '0deg'
                },
                {
                    //10
                    id: 'e989f611fd25346f',
                    idName: '下宁巷3-2号3幢2单元右边3',
                    background: '',
                    class: 'parkClass',
                    left: '36',
                    top: '655',
                    width: '29',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //11
                    id: '75826d6384e23d50',
                    idName: '下宁巷3-1号6幢4单元旁',
                    background: '',
                    class: 'parkClass',
                    left: '48',
                    top: '248',
                    width: '13',
                    height: '30',
                    rotate: '0deg'
                },
                {
                    //12
                    id: '7f1b7a0f88355e16',
                    idName: '下宁巷3-2号1幢4单元右边',
                    background: '',
                    class: 'parkClass',
                    left: '35',
                    top: '463',
                    width: '13',
                    height: '34',
                    rotate: '0deg'
                },
                {
                    //13
                    id: '2d2bba4bd72050b3',
                    idName: '下宁巷监控室旁边电线',
                    background: '',
                    class: 'parkClass',
                    left: '195',
                    top: '218',
                    width: '36',
                    height: '13',
                    rotate: '0deg'
                },
                {
                    //14
                    id: '8722cc9845e4471a',
                    idName: '下宁巷3-2号3幢2单元右边',
                    background: '',
                    class: 'parkClass',
                    left: '16',
                    top: '608',
                    width: '13',
                    height: '34',
                    rotate: '0deg'
                },
                {
                    //15
                    id: '92ad5c01413186a5',
                    idName: '下宁巷3-2号1幢2单元左侧',
                    background: '',
                    class: 'parkClass',
                    left: '119',
                    top: '433',
                    width: '32',
                    height: '12',
                    rotate: '0deg'
                }, // {//16
                //   id:"98045773e5597d3",
                //   idName:"下宁巷1号5幢4单元右边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //17
                    id: 'a9b33cdbade2f4b5',
                    idName: '下宁巷监控室旁边电线',
                    background: '',
                    class: 'parkClass',
                    left: '234',
                    top: '232',
                    width: '13',
                    height: '25',
                    rotate: '0deg'
                },
                {
                    //18
                    id: 'aab9e6fa611a5c26',
                    idName: '下宁巷3-1号7幢旁边车棚1',
                    background: '',
                    class: 'parkClass',
                    left: '173',
                    top: '162',
                    width: '13',
                    height: '31',
                    rotate: '0deg'
                },
                {
                    //19
                    id: 'c2c47a126e735851',
                    idName: '下宁巷3-1号4幢2单元门口',
                    background: '',
                    class: 'parkClass',
                    left: '115',
                    top: '363',
                    width: '34',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //20
                    id: 'f49745d93ea718ef',
                    idName: '下宁巷3-2号1幢1单元车棚',
                    background: '',
                    class: 'parkClass',
                    left: '153',
                    top: '433',
                    width: '32',
                    height: '12',
                    rotate: '0deg'
                }, // {//21
                //   id:"f9d5a89fda5dee29",
                //   idName:"下宁巷3-3幢教宿电线杆1",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //3
                    id: '25be18139c2cc319',
                    idName: '求智巷5号3幢2单元右侧1',
                    background: '',
                    class: 'parkClass',
                    left: '366',
                    top: '233',
                    width: '13',
                    height: '34',
                    rotate: '0deg'
                }, // {//  下面错的51
                //   id:"25a80d0de509e260",
                //   idName:"下宁巷3-1号6幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "224",
                //   top: "270",
                //   width: "13",
                //   height: "31",
                //   rotate:"0deg",
                // },
                {
                    //22
                    id: 'd120d8a9dee4b9fe',
                    idName: '下宁巷3-1号6幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '173',
                    top: '195',
                    width: '13',
                    height: '31',
                    rotate: '0deg'
                },
                {
                    //23
                    id: '6ae2525e5d786627',
                    idName: '下宁巷3-1号5幢5单元右侧',
                    background: '',
                    class: 'parkClass',
                    left: '80',
                    top: '307',
                    width: '32',
                    height: '11',
                    rotate: '0deg'
                }, // {//24
                //   id:"9269b994ca5ca1ac",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //25
                    id: '7bfa6d789e0bab12',
                    idName: '下宁巷3-1号5幢2单元',
                    background: '',
                    class: 'parkClass',
                    left: '115',
                    top: '307',
                    width: '32',
                    height: '11',
                    rotate: '0deg'
                },
                {
                    //26
                    id: 'abbabee86e096d59',
                    idName: '下宁巷3-2号2幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '132',
                    top: '514',
                    width: '53',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //27
                    id: 'a81f6bb1c525bcd7',
                    idName: '下宁巷3-2号1幢2单元2',
                    background: '',
                    class: 'parkClass',
                    left: '84',
                    top: '433',
                    width: '32',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //28
                    id: 'fac1e1bc71904b65',
                    idName: '下宁巷3-1号5幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '397',
                    top: '344',
                    width: '37',
                    height: '13',
                    rotate: '0deg'
                }, // {//29
                //   id:"2d2bba4bd72050b3",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//30
                //   id:"487380810dcacce8",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//31
                //   id:"48e4bca9a3447e57",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//32
                //   id:"9ebc00ce64a9381f",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//33
                //   id:"abdaa84d99afae5a",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//34
                //   id:"e989f611fd25346f",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                // {//35
                //   id:"f1608125dfa54d39",
                //   idName:"下宁巷3-1号5幢1单元左边",
                //   background: "",
                //   class: "parkClass",
                //   left: "114",
                //   top: "162",
                //   width: "42",
                //   height: "11",
                //   rotate:"0deg",
                // },
                {
                    //s少的54
                    id: '97e9aba513ddcbca',
                    idName: '下宁巷3-1号5幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '71',
                    top: '514',
                    width: '27',
                    height: '12',
                    rotate: '0deg'
                },
                {
                    //s少的60
                    id: '7e73758107be85f8',
                    idName: '下宁巷3-1号5幢1单元左边',
                    background: '',
                    class: 'parkClass',
                    left: '296',
                    top: '344',
                    width: '37',
                    height: '13',
                    rotate: '0deg'
                }
            ];
            this.setData({
                parkList: parkList
            });
        }

        util.request(api.getEncryPath + '?path=' + value, '', 'POST').then((res) => {
            this.setData({
                img: res
            });
        });
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    // onShareAppMessage: function() {}
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */ methods: {
		 goMy() {
		 		     uni.navigateBack({
		 		         delta: 1
		 		     });
		 		 },
        clickPark: function (e) {
            var that = this;

            let _cardInfo = this.cameraInfo.list.filter(function (item) {
                // 使用filter方法
                if (item.apeId == e.currentTarget.dataset.id) {
                    return item;
                }
            });

            var alertCard = _cardInfo ? _cardInfo[0] : {};
            var cardInfo = this.card;
            var left = parseInt(e.currentTarget.dataset.left) - 120 > 0 ? parseInt(e.currentTarget.dataset.left) - 120 : 0;
            var top = parseInt(e.currentTarget.dataset.top) - 148 > 80 ? parseInt(e.currentTarget.dataset.top) - 148 : 80;
            cardInfo.left = 0;
            cardInfo.top = 80;

            if (alertCard && alertCard.picture) {
                util.request(api.getEncryPath + '?path=' + alertCard.picture, '', 'POST').then((res) => {
                    alertCard.picture2 = res;
                    that.setData({
                        cardInfo: alertCard
                    });
                });
                that.setData({
                    showCard: true,
                    card: cardInfo,
                    info: that.info + e.currentTarget.dataset.id
                });
            } else {
                uni.showToast({
                    title: '抱歉，该点位信息不全！',
                    icon: 'none'
                });
                that.setData({
                    cardInfo: {}
                });
            }
        },

        findCameraGuide(parkingCode) {
            util.request(api.findCameraGuide + '?parkingCode=' + parkingCode, '', 'GET')
                .then((res) => {
                    if (res.success) {
                        this.setData({
                            cameraInfo: res.data
                        });
                        var parkList = this.parkList;

                        for (var i = 0; i < parkList.length; i++) {
                            let _cardInfo = this.cameraInfo.list.filter(function (item) {
                                // 使用filter方法
                                if (item.apeId == parkList[i].id) {
                                    return item;
                                }
                            });

                            if (_cardInfo && _cardInfo[0]) {
                                var bgcolor = _cardInfo[0].carportCount + _cardInfo[0].tempCarportCount - _cardInfo[0].useCount - _cardInfo[0].tempUseCount > 0 ? 'green' : 'red';
                                parkList[i].background = bgcolor;
                            } else {
                                if (!parkList[i].background) {
                                    parkList[i].background = 'green';
                                }
                            }
                        }
                        this.setData({
                            parkList: parkList
                        });
                    } else {
                        uni.showToast({
                            title: res.msg || '提交失败',
                            icon: 'none'
                        });
                    }
                })
                .catch((err) => {
                    console.log(err); // wx.showToast({
                    //   title: '接口出错了...',
                    //   icon:'none'
                    // })
                });
        },

        clickPackInfo() {
            console.log('clickPackInfo');
        },

        //点击事件
        clickImg: function (e) {
            var imgUrl = this.img; // console.log(clickImg);

            uni.previewImage({
                urls: [imgUrl],
                //需要预览的图片http链接列表，注意是数组
                current: '',
                // 当前显示图片的http链接，默认是第一个
                success: function (res) {},
                fail: function (res) {},
                complete: function (res) {}
            });
        },

        closeCard() {
            this.setData({
                showCard: false
            });
        },

        touchstartCallback: function (e) {
            // 单手指缩放开始，也不做任何处理
            if (e.touches.length == 1) {
                return;
            }

            console.log('双手指触发开始'); // 注意touchstartCallback 真正代码的开始
            // 一开始我并没有这个回调函数，会出现缩小的时候有瞬间被放大过程的bug
            // 当两根手指放上去的时候，就将distance 初始化。

            let xMove = e.touches[1].clientX - e.touches[0].clientX;
            let yMove = e.touches[1].clientY - e.touches[0].clientY;
            let distance = Math.sqrt(xMove * xMove + yMove * yMove);
            this.setData({
                'touch.distance': distance
            });
        },

        touchmoveCallback: function (e) {
            let touch = this.touch; // 单手指缩放我们不做任何操作

            if (e.touches.length == 1) {
                return;
            }

            console.log('双手指运动');
            let xMove = e.touches[1].clientX - e.touches[0].clientX;
            let yMove = e.touches[1].clientY - e.touches[0].clientY; // 新的 ditance

            let distance = Math.sqrt(xMove * xMove + yMove * yMove);
            let distanceDiff = distance - touch.distance;
            let newScale = touch.scale + 0.005 * distanceDiff; // 为了防止缩放得太大，所以scale需要限制，同理最小值也是

            if (newScale >= 2) {
                newScale = 2;
            }

            if (newScale <= 0.3) {
                newScale = 0.3;
            }

            let scaleWidth = newScale * touch.baseWidth;
            let scaleHeight = newScale * touch.baseHeight; // 赋值 新的 => 旧的

            this.setData({
                'touch.distance': distance,
                'touch.scale': newScale,
                'touch.scaleWidth': scaleWidth,
                'touch.scaleHeight': scaleHeight,
                'touch.diff': distanceDiff
            });
        },

        bindload: function (e) {
            // bindload 这个api是<image>组件的api类似<img>的onload属性
            console.log('bindload111');

            if (this.parkingName == '下宁巷南停车场') {
                this.setData({
                    'touch.baseWidth': 501,
                    'touch.baseHeight': 613,
                    'touch.scaleWidth': 501,
                    'touch.scaleHeight': 613
                });
            } else {
                this.setData({
                    'touch.baseWidth': 375,
                    'touch.baseHeight': 740,
                    'touch.scaleWidth': 375,
                    'touch.scaleHeight': 740
                });
            }
        },

        touchStartHandle(e) {
            // 单手指缩放开始，也不做任何处理
            if (e.touches.length == 1) {
                console.log('单滑了');
                return;
            }

            console.log('双手指触发开始'); // 注意touchstartCallback 真正代码的开始
            // 一开始我并没有这个回调函数，会出现缩小的时候有瞬间被放大过程的bug
            // 当两根手指放上去的时候，就将distance 初始化。

            let xMove = e.touches[1].clientX - e.touches[0].clientX;
            let yMove = e.touches[1].clientY - e.touches[0].clientY;
            let distance = Math.sqrt(xMove * xMove + yMove * yMove);
            this.setData({
                'touch.distance': distance
            });
        },

        touchMoveHandle(e) {
            let touch = this.touch; // 单手指缩放我们不做任何操作

            if (e.touches.length == 1) {
                console.log('单滑了');
                return;
            }

            console.log('双手指运动开始');
            let xMove = e.touches[1].clientX - e.touches[0].clientX;
            let yMove = e.touches[1].clientY - e.touches[0].clientY; // 新的 ditance

            let distance = Math.sqrt(xMove * xMove + yMove * yMove);
            let distanceDiff = distance - touch.distance;
            let newScale = touch.scale + 0.005 * distanceDiff; // 为了防止缩放得太大，所以scale需要限制，同理最小值也是

            if (newScale >= 2) {
                newScale = 2;
            }

            if (newScale <= 0.2) {
                newScale = 0.2;
            }

            let scaleWidth = newScale * touch.baseWidth;
            let scaleHeight = newScale * touch.baseHeight; // 赋值 新的 => 旧的

            this.setData({
                'touch.distance': distance,
                'touch.scale': newScale,
                'touch.scaleWidth': scaleWidth,
                'touch.scaleHeight': scaleHeight,
                'touch.diff': distanceDiff
            });
        },

        load: function (e) {
            // bindload 这个api是<image>组件的api类似<img>的onload属性
            this.setData({
                'touch.baseWidth': e.detail.width,
                'touch.baseHeight': e.detail.height,
                'touch.scaleWidth': e.detail.width,
                'touch.scaleHeight': e.detail.height
            });
        }
    }
};
</script>
<style>
@import './index.css';
</style>
